<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="renderer" content="webkit" />
<link href="../css/bootstrap.min.css" rel="stylesheet" />
<link href="../css/font-awesome.min.css" rel="stylesheet" />
<link href="../css/plugins/chosen/chosen.css" rel="stylesheet" />
<link href="../css/plugins/dataTables/dataTables.bootstrap.css"
	rel="stylesheet" />
<link href="../css/plugins/iCheck/custom.css" rel="stylesheet" />
<link href="../css/plugins/toastr/toastr.min.css" rel="stylesheet" />
<link href="../css/animate.css" rel="stylesheet" />
<link href="../css/style.css" rel="stylesheet" />
</head>
<body class="top-navigation">
	<div id="wrapper">
		<div id="page-wrapper" class="gray-bg dashbard-1">
			<div class="row border-bottom">
				<nav class="navbar navbar-static-top" style="margin-bottom:0">
					<div class="navbar-header">
						<div class="minimalize-styl-2">
							<a class="btn btn-primary" href="main.html"><i
								class="fa fa-home"></i> 主页</a>
							<!-- ++++++++++++++++++++++++++++++++ -->
							<ol id="guide" class="breadcrumb m-l">
								<li><a>调度中心</a></li>
								<li><a>商品调拨</a></li>
								<li><strong>商品调拨</strong></li>
							</ol>
							<!-- ################################ -->
						</div>
					</div>
					<ul class="nav navbar-top-links navbar-right">
						<li><a href="index.html" title="返回首页"><i
								class="fa fa-home"></i></a></li>
						<li><span class="m-r-sm text-muted welcome-message">欢迎使用Feces物流管理系统</span></li>
					</ul>
				</nav>
			</div>
			<div class="wrapper wrapper-content animated fadeInRight">
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox float-e-margins border-bottom">
							<div class="ibox-title">
								<!-- ++++++++++++++++++++++++++++++++ -->
								<h5>添加新调拨单</h5>
								<!-- ################################ -->
								<div class="ibox-tools">
									<!-- ++++++++++++++++++++++++++++++++ -->
									<a class="collapse-link btn-link btn-xs"> 收起/展开<i
										class="fa fa-chevron-up"></i>
									</a>
									<!-- ################################ -->
								</div>
							</div>
							<div class="ibox-content" style="display:none;">
								<form id="new" class="form-horizontal" data-role="form">
									<div class="form-group">
										<label for="new-name" class="col-md-3 control-label">调拨单号</label>
										<div class="col-md-8">
											<input type="text" id="new-id" placeholder="请输入调拨单号"
												class="form-control">
										</div>
									</div>
									<div class="form-group">
										<label for="new-major" class="col-md-3 control-label">出库库房</label>
										<div class="col-md-8">
											<select class="form-control" id="new-out">
												<option disabled>请选择出库库房</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<label for="new-minor" class="col-md-3 control-label">入库库房</label>
										<div class="col-md-8">
											<select class="form-control" id="new-in">
												<option disabled>请选择入库库房</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<label for="new-major" class="col-md-3 control-label">商品一级分类</label>
										<div class="col-md-8">
											<select class="form-control" id="new-major">
												<option disabled>请选择一级分类</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<label for="new-major" class="col-md-3 control-label">商品二级分类</label>
										<div class="col-md-8">
											<select class="form-control" id="new-minor" disabled>
												<option disabled>请选择二级分类</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<label for="new-price" class="col-md-3 control-label">商品名称</label>
										<div class="col-md-8">
											<input type="text" id="new-name" placeholder="请输入商品名称"
												class="form-control">
										</div>
									</div>
									<div class="form-group">
										<label for="new-unit" class="col-md-3 control-label">计量单位</label>
										<div class="col-md-8">
											<input type="text" id="new-unit" placeholder="请输入计量单位"
												class="form-control">
										</div>
									</div>


									<div class="form-group">
										<div class="col-md-3 col-md-offset-3">
											<button class="btn btn-outline btn-primary" type="submit">新
												建</button>
											<button class="btn btn-outline btn-danger" type="reset">重
												置</button>
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox float-e-margins">
							<div class="ibox-title">
								<!-- ++++++++++++++++++++++++++++++++ -->
								<h5>调拨单概览</h5>
								<!-- ################################ -->
								<div class="ibox-tools">
									<!-- ++++++++++++++++++++++++++++++++ -->
									<a class="collapse-link btn-link btn-xs"> 收起/展开<i
										class="fa fa-chevron-up"></i>
									</a>
									<!-- ################################ -->
								</div>
							</div>
							<div class="ibox-content">
								<table class="table table-striped table-bordered table-hover"
									id="allocation">
									<thead>
										<tr>
											<th>调拨单号</th>
											<th>出库库房</th>
											<th>入库库房</th>
											<th>商品分类</th>
											<th>商品名称</th>
											<th>库存量</th>
											<th>调拨数量</th>
											<th>计量单位</th>
											<th>要求出库日期</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody></tbody>
									<tfoot>
										<tr>
											<th>调拨单号</th>
											<th>出库库房</th>
											<th>入库库房</th>
											<th>商品分类</th>
											<th>商品名称</th>
											<th>库存量</th>
											<th>调拨数量</th>
											<th>计量单位</th>
											<th>要求出库日期</th>
											<th>操作</th>
										</tr>
									</tfoot>
								</table>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script src="../js/jquery-2.1.1.min.js"></script>
	<script src="../js/bootstrap.min.js"></script>
	<script src="../js/plugins/chosen/chosen.jquery.js"></script>
	<script src="../js/plugins/datepicker/bootstrap-datepicker.js"></script>
	<script src="../js/plugins/dataTables/jquery.dataTables.js"></script>
	<script src="../js/plugins/dataTables/dataTables.bootstrap.js"></script>
	<script src="../js/plugins/iCheck/icheck.min.js"></script>
	<script src="../js/plugins/jeditable/jquery.jeditable.js"></script>
	<script src="../js/plugins/metisMenu/jquery.metisMenu.js"></script>
	<script src="../js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
	<script src="../js/plugins/toastr/toastr.min.js"></script>
	<script src="../js/feces.js"></script>
	<script src="../js/plugins/pace/pace.min.js"></script>

	<script>
		$(function() {
			var dataURL = '../api/allocation.json';
			var crudURL = '../api/allocation';
			var convert = function(allocation) {
				return [ allocation.id, 
				         allocation.outStorehouse.name, 
				         allocation.inStorehouse.name,
				         allocation.clientOrder.products[0].product.majorType.name, 
				         allocation.clientOrder.products[0].product.name,
				         allocation.clientOrder.products[0].product_number,
				         null,
				         allocation.clientOrder.unit,
				         allocation.out_date,
						null ];
			};
			$('#allocation')
					.dataTable(
							{
								ajax : {
									url : dataURL,
									dataSrc : function(response) {
										return response.data.map(convert);
									},
								},
								stateSave : true,
								createdRow : function(row, data, dataIndex) {
									$(row).data({
										id : data[0]
									});
									$('td:eq(6)', row).data({
										col : 'num'
									}).attr('data-edit', 'text');
									$('td:eq(9)', row)
											.append(
													$('<a></a>')
															.addClass(
																	'btn btn-outline btn-primary btn-xs')
															.attr('href',
																	'javascript:void(0);')
															.text('调拨')
															.click(
																	function() {
																		if($('td:eq(6)',row).data==null){
																		toastr.error('调拨失败');}
																		else
																			toastr.success('调拨成功')
																	}));
								},
								initComplete : function() {
									$('[data-edit]', this).attr('title',
											'点击以编辑');
									$('[data-edit="text"]', this).editable(
											function(value) {
												// put.apply(this, arguments);
												return value;
											}, {
												submit : '确定',
												cancel : '取消',
												height : '100%'
											});
								}
							});
			$('#new').submit(
					function() {
						event.preventDefault();
						var form = this;
						$.post(crudURL, $(this).serialize()).done(
								function(result) {
									if (result.status == 0) {
										$('#display').dataTable().fnAddData(
												convert(result.data));
										form.reset();
										toastr.success('创建成功');
									} else {
										toastr.error('创建失败');
									}
								}).fail(function() {
							toastr.error('创建失败');
						});
					});

			/*
			 var put = function(data){
			 $.ajax({
			 type:'PUT',
			 url: crudURL,
			 data: data,
			 success: function(result){
			 if (result.status == 0) {
			 toastr.success('修改成功');
			 } else {
			 toastr.error('修改失败');
			 }
			 },
			 });
			 };
			
			 $('#display').dataTable({
			 ajax: {
			 url: dataURL,
			 dataSrc: function(response){
			 return response.data.map(convert);
			 },
			 },
			 stateSave: true,
			 createdRow: function(row, data, dataIndex){
			 var table = this;
			 var id = $('td:eq(0)', row).text();
			 $('td:eq(1)', row).attr('data-col', 'name').attr('data-edit', '');
			
			 $('td:eq(2)', row).attr('data-col', 'majorType').editable(function(value){
			 put({id: id, column: $(this).attr('data-col'), value: value });
			 return types[value];
			 }, {
			 type: 'select',
			 data: JSON.stringify(types),
			 submit: '确定',
			 cancel: '取消',
			 height: '100%'
			 });
			
			 $('td:eq(3)', row).attr('data-col', 'minorType').editable(function(value){
			 put({id: id, column: $(this).attr('data-col'), value: value });
			 return types[value];
			 }, {
			 type: 'select',
			 data: JSON.stringify(types),
			 submit: '确定',
			 cancel: '取消',
			 height: '100%'
			 });
			
			 $('td:eq(4)', row).attr('data-col', 'unit').attr('data-edit', '');
			 $('td:eq(5)', row).attr('data-col', 'price').attr('data-edit', '');
			 $('td:eq(6)', row).attr('data-col', 'discount').attr('data-edit', '');
			 $('td:eq(7)', row).attr('data-col', 'cost').attr('data-edit', '');
			 $('td:eq(8)', row).attr('data-col', 'type').attr('data-edit', '');
			 $('td:eq(9)', row).attr('data-col', 'supplier').attr('data-edit', '');
			 $('td:eq(10)', row).attr('data-col', 'productor').attr('data-edit', '');
			 $('td:eq(11)', row).attr('data-col', 'period').attr('data-edit', '');
			 $('td:eq(12)', row).attr('data-col', 'returnable').attr('data-edit', '');
			 $('td:eq(13)', row).attr('data-col', 'changable').attr('data-edit', '');
			 $('td:eq(14)', row).attr('data-col', 'remark').attr('data-edit', '');
			
			 $('td:eq(15)', row).append(
			 $('<a></a>').addClass('btn btn-outline btn-danger btn-xs').attr('href', 'javascript:void(0);').text('删 除').click(function(){
			 $.ajax({
			 type: 'DELETE',
			 url: crudURL,
			 data: { id: id, _: Date.now() },
			 success: function(result){
			 if (result.status == 0) {
			 toastr.success('删除成功');
			 table.fnDeleteRow(dataIndex);
			 } else {
			 toastr.error('删除失败');
			 }
			 }
			 });
			 })
			 );
			
			
			
			 $('[data-edit]', row).editable(function(value){
			 put({id: id, column: $(this).attr('data-col'), value: value });
			 return value;
			 },{
			 submit: '确定',
			 cancel: '取消',
			 height: '100%'
			 });
			
			 }
			 });
			 */

			$('.i-checks').iCheck({
				checkboxClass : 'icheckbox_square-green',
				radioClass : 'iradio_square-green',
			});
		});
	</script>
</html>
